<%--
 *
 *  Created by IntelliJ IDEA.
 *  User: Bestick
 *  Date: 2016/7/8
 *  Time: 15:26
 *  Url: http://www.bestick.cn
 *  Copyright © 2015-2016 Bestick All rights reserved
 *  -----------------------------------------------------------
 *  会当凌绝顶，一览众山小。
 *
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <%-- IF IE --%>
    <jsp:include page="${pageContext.request.contextPath}/WEB-INF/jsp/if_ie.jsp"/>

    <!-- CharSet -->
    <meta charset="utf-8">

    <!-- Author -->
    <meta name="author" content="www.bestick.cn">

    <!-- render mode -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

    <!-- Title -->
    <title>WeightRecord</title>

    <!-- Mobile Meta -->
    <meta name="viewport" content="width=device-width,initial-scale=1">

    <!-- Favicon -->
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/resources/app/images/logo/favicon.ico">

    <!-- Bootstrap core CSS -->
    <link href="${pageContext.request.contextPath}/resources/libs/css/bootstrap/css/bootstrap.min.css" rel="stylesheet">

    <!-- DateDropper core CSS -->
    <link href="${pageContext.request.contextPath}/resources/libs/js/datedropper/datedropper.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/resources/libs/js/datedropper/timedropper.min.css" rel="stylesheet">

    <!-- WeightRecord core CSS -->
    <link href="${pageContext.request.contextPath}/resources/app/css/home/wr.css" rel="stylesheet">

    <link rel="stylesheet prefetch" href="http://fonts.googleapis.com/css?family=Days+One">
</head>
<body class="overflow-y-scroll">
<div id="wr-loading-box" class="wr-loading-box">
    <span class="loading"></span>
</div>

<div id="wr-banner">
</div>
<div class="wr-main container-fluid">
    <div class="row">
        <nav id="wr-nav">
            <ul id="main">
                <li id="health">健康</li>
                <li id="study">学习</li>
                <div id="marker"></div>
            </ul>
        </nav>
        <div class="col-md-8 col-md-offset-2" style="height: 610px">
            <div id="home"></div>
            <div id="home-wr"></div>
            <div id="home-sr" class="hidden"></div>
            <div class="change-mood hidden">
                <div class="music-ico"></div>
            </div>
        </div>
    </div>

    <!-- 背景音乐 -->
    <audio id="bg-music-src1" style="display: none;" autoplay="autoplay" loop="loop">
        <source src="http://ocuddscaa.bkt.clouddn.com/music/mp3/bg-music-1.mp3" type="audio/mp3" />
    </audio>
    <audio id="bg-music-src2" style="display: none;" loop="loop">
        <source src="http://ocuddscaa.bkt.clouddn.com/music/mp3/bg-music-2.mp3" type="audio/mp3" />
    </audio>
    <audio id="bg-music-src3" style="display: none;" loop="loop">
        <source src="http://ocuddscaa.bkt.clouddn.com/music/mp3/bg-music-3.mp3" type="audio/mp3" />
    </audio>
</div>

<%--<hr/>--%>
<%--<h1>当前在线人数：<%=StatisticUtil.getOnLineUsersInstance().size()%>万</h1>--%>

<!-- JavaScript files placed at the end of the document so the pages load faster
==================================================================================== -->
<!-- lib and core js files -->
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/libs/js/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/libs/js/bootstrap.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/libs/js/jsrender.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/libs/js/Highcharts.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/libs/js/layer/layer.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/libs/js/jquery.countdown.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/libs/js/datedropper/datedropper.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/libs/js/datedropper/timedropper.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/app/js/home/common.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/app/js/home/wr.js"></script>

<script id="home-temp" type="text/x-jsrender">
    <div class="wr-header clearfix">
        <input id="userId" type="hidden" value="{{:data.userId}}"/>
        <p>亲爱的：
            <span class="name">{{:data.userName}}</span>
            <span class="sex">
                {{if data.sex == "男"}}
                    <img id="img-boy" src="/resources/app/images/logo/boy.png"/>
                {{else}}
                    <img id="img-girl" src="/resources/app/images/logo/girl.png"/>
                {{/if}}
            </span>&nbsp;
            <a class="logout" href="javascript:logout();" style="color: green !important;">[退出]</a>
            ，欢迎使用WeightRecord系统
        </p>
        <p>您的预期指标为：<span class="expectedWeight">{{:data.expectedWeight}}</span>kg</p>
        <p>您的塑形宣言是：<span class="signature">{{:data.signature}}</span></p>
    </div>
    <hr/>
</script>

<script id="home-wr-temp" type="text/x-jsrender">
    <div class="wr-graph">
        <p class="tab">
            <button id="btn-graph" type="button" class="btn btn-success btn-sm">&nbsp;图表展示</button>
            <button id="btn-statistic" type="button" class="btn btn-info btn-sm">&nbsp;数据记录</button>
        </p>
        <div class="graph" id="box-graph">
        </div>
        <div class="statistic hidden" id="box-statistic">
            <table class="table">
                <tr>
                    <th width="10%">#</th>
                    <th width="20%">每日最高</th>
                    <th width="20%">每日最低</th>
                    <th width="50%">记录日期</th>
                    <%--<th width="33%">操作栏</th>--%>
                </tr>
            </table>
            <div class="statistic-body overflow-y-scroll">
                <table class="table table-hover">
                    {{for data.recordList}}
                        <tr>
                            <td width="10%">{{: #get('array').data.length-#getIndex()}}</td>
                            <td width="20%">{{doubleFormat maxWeight/}}</td>
                            <td width="20%">{{doubleFormat minWeight/}}</td>
                            <td width="50%">{{dateFormat recordTime "timeStamp2DateTime"/}}</td>
                            <%--<td width="33%">--%>
                                <%--<button id="btn-update" type="button" class="btn btn-success btn-sm">修改</button>--%>
                                <%--<button id="btn-delete" type="button" class="btn btn-danger btn-sm">删除</button>--%>
                            <%--</td>--%>
                        </tr>
                    {{/for}}
                </table>
            </div>
            <div class="wr-operate">
                <p>
                    最高值：
                    <input type="number" min="30.0" max="200.0" step="0.1" id="max" class="form-control number"/>
                    ，最低值：
                    <input type="number" min="30.0" max="200.0" step="0.1" id="min" class="form-control number"/>
                </p>
                <p>
                    <button id="btn-submit" type="button" class="btn btn-success btn-sm">提交</button>
                </p>
            </div>
        </div>
    </div>
</script>

<script id="home-sr-temp" type="text/x-jsrender">
    <div class="wr-graph">
        <p class="tab">
            <button id="s-btn-graph" type="button" class="btn btn-success btn-sm">&nbsp;最后战役</button>
            <button id="s-btn-statistic" type="button" class="btn btn-info btn-sm">&nbsp;数据记录</button>
        </p>
        <div class="graph" id="s-box-graph">
            <div class="zzsc-content bgcolor-8 overflow-y-scroll">
                <p>距离2016年12月24日还有：</p>
                <span id="clock"></span>
            </div>
		</div>
        <div class="statistic hidden" id="s-box-statistic">
            <table class="table">
                <tr>
                    <th width="6%">#</th>
                    <th width="12%">起床时间</th>
                    <th width="12%">睡觉时间</th>
                    <th width="40%">今日小结</th>
                    <th width="30%">记录时间</th>
                    <%--<th width="33%">操作栏</th>--%>
                </tr>
            </table>
            <div class="statistic-body overflow-y-scroll">
                <table class="table table-hover" style="table-layout: fixed;">
                    {{for data.studyRecordList}}
                        <tr>
                            <td width="6%">{{: #get('array').data.length-#getIndex()}}</td>
                            <td width="12%">{{: studyGetupTime}}</td>
                            <td width="12%">{{: studyGo2bedTime}}</td>
                            <td width="40%">{{: studyTodaySum}}</td>
                            <td width="30%">{{dateFormat studyRecordTime "timeStamp2DateTime"/}}</td>
                            <%--<td width="33%">--%>
                                <%--<button id="btn-update" type="button" class="btn btn-success btn-sm">修改</button>--%>
                                <%--<button id="btn-delete" type="button" class="btn btn-danger btn-sm">删除</button>--%>
                            <%--</td>--%>
                        </tr>
                    {{/for}}
                </table>
            </div>
            <div class="wr-operate">
                <p>
                    起床时间：
                    <input type="text" id="getup-time" name="studyGetupTime" class="form-control number"/>
                    ，睡觉时间：
                    <input type="text" id="go2bed-time" id="min" name="studyGo2bedTime" class="form-control number"/>
                    <textarea type="textarea" id="today-sum" name="studyTodaySum" class="form-control overflow-y-scroll" placeholder="在这里填写今日小结..."></textarea>
                </p>
                <p>
                    <button id="s-btn-submit" type="button" class="btn btn-success btn-sm">提交</button>
                </p>
            </div>
        </div>
    </div>
</script>
</body>
</html>
